<!--
 * 配置管理
 * @author luguoxiang
 * @date 2023-03-27
 * 开源项目：https://gitee.com/lgx1992/lg-soar 求star！请给我star！请帮我点个star！
-->
<template>
  <t-tabs class="inner-tabs" theme="card" placement="left" default-value="bank" @change="change">
    <t-tab-panel value="bank" label="银行信息" :destroy-on-hide="false">
      <back-config ref="bank" />
    </t-tab-panel>
    <t-tab-panel value="contact" label="联系方式" :destroy-on-hide="false">
      <contact-config ref="contact" />
    </t-tab-panel>
  </t-tabs>
  <div class="inner-btns">
    <t-button theme="primary" @click="submit">保存</t-button>
    <t-button theme="default" variant="base" @click="reset">重置</t-button>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import BackConfig from './BackConfig.vue';
import ContactConfig from './ContactConfig.vue';

const bank = ref();
const contact = ref();
const forms = { bank, contact };
let curr = null;

function change(e) {
  curr = forms[e];
}
change('bank');

function submit() {
  curr.value.submit();
}

function reset() {
  curr.value.reset();
}
</script>
<style scoped lang="less">
.inner-btns {
  height: 60px;
  line-height: 60px;
  padding-left: 100px;
}
.inner-tabs {
  height: calc(100% - 60px);
  :deep(.t-tabs__content) {
    padding: var(--app-space);
    height: 100%;
  }
}
</style>
